<template>
  <div class="switch-demo">
    <h3 class="title">基本</h3>
    <div>
      <div>{{ check1 }}</div>
      <div><d-switch v-model="check1">测试1</d-switch></div>
      <div>{{ check2 }}</div>
      <div><d-switch v-model="check2" :small="true">测试2</d-switch></div>
    </div>
    <h3 class="title">自定义true与false的值</h3>
    <div>
      <div>{{ check3 }}</div>
      <div><d-switch v-model="check3" :trueValue="1" falseValue="2">1/2</d-switch></div>
      <div>{{ check4 }}</div>
      <div><d-switch v-model="check4" trueValue="yes" falseValue="no">yes/no</d-switch></div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'switchDemo',
  data () {
    return {
      check1: false,
      check2: false,
      check3: 2,
      check4: 'no'
    }
  }
}
</script>

<style lang="stylus" scoped>
// .switch-demo
</style>
